<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>合并相邻行内容相同的单元格</title>    
    <style>
        /* reset */
        html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin:0;padding:0;}
        header,footer,section,article,aside,nav,hgroup,address,figure,figcaption,menu,details{display:block;}
        table{border-collapse:collapse;border-spacing:0;}
        caption,th{text-align:left;font-weight:normal;}
        html,body,fieldset,img,iframe,abbr{border:0;}
        i,cite,em,var,address,dfn{font-style:normal;}
        li{list-style:none;}
        h1,h2,h3,h4,h5,h6,small{font-size:100%;}
        sup,sub{font-size:83%;}
        pre,code,kbd,samp{font-family:inherit;}
        q:before,q:after{content:none;}
        textarea{overflow:auto;resize:none;}
        label,summary{cursor:default;}
        a,button{cursor:pointer;}
        h1,h2,h3,h4,h5,h6,em,strong,b{font-weight:bold;}
        del,ins,u,s,a,a:hover{text-decoration:none;}
        body{background:#fff;}
        a,a:hover{color:#333;}
        .demo{padding: 20px;}
        .m-table td,.m-table th{border:1px solid #e5e5e5;padding: 10px;}
    </style>
    
</head>
<body>

<div id="demo" class="demo">
    <table id="J_table" class="m-table">
        <tr>
            <th>abcde</th>
            <td>content_001</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abc</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abc</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abc</th>
            <td>content_001</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abc</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abc</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abcd</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abc</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abcde</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
        <tr>
            <th>abcde</th>
            <td>content_01</td>
            <td>content_02</td>
            <td>content_03</td>
        </tr>
    </table>
</div>
<script src="mergeRowsCell.js"></script>
<script>
   var demo = new mergeRowsCell('J_table');
   demo.merge(0,0);
   demo.merge(0,1);
   //...
   //demo.merge(0,3);
</script>
</body>
</html>
